// 房间管理文件

// 等待DOM加载完成
document.addEventListener('DOMContentLoaded', () => {
    // 获取DOM元素
    const roomListElement = document.getElementById('roomList');
    const createRoomForm = document.getElementById('createRoomForm');
    const roomNameInput = document.getElementById('roomName');
    const playerNameInput = document.getElementById('playerName');
    const colorInput = document.getElementById('color');
    
    // 生成随机玩家名称
    function generateRandomPlayerName() {
        const adjectives = ['勇敢的', '机智的', '无敌的', '神秘的', '迅捷的', '强大的', '传奇的', '幸运的', '敏捷的', '坚固的'];
        const nouns = ['坦克手', '战士', '指挥官', '将军', '勇士', '英雄', '战车', '猎手', '守卫', '突击手'];
        const randomNum = Math.floor(Math.random() * 1000);
        
        const adjective = adjectives[Math.floor(Math.random() * adjectives.length)];
        const noun = nouns[Math.floor(Math.random() * nouns.length)];
        
        return `${adjective}${noun}${randomNum}`;
    }
    
    // 设置随机玩家名称作为默认值
    playerNameInput.value = generateRandomPlayerName();
    
    // 连接Socket.io服务器
    const socket = io("");
    
    // 定义定时刷新间隔（毫秒）
    const REFRESH_INTERVAL = 5000; // 10秒刷新一次
    let refreshTimer;
    
    // 定时刷新房间列表函数
    function startAutoRefresh() {
        // 清除可能存在的旧定时器
        if (refreshTimer) {
            clearInterval(refreshTimer);
        }
        
        // 设置新的定时器
        refreshTimer = setInterval(() => {
            console.log('自动刷新房间列表...');
            socket.emit('getRooms');
        }, REFRESH_INTERVAL);
    }
    
    // 停止自动刷新
    function stopAutoRefresh() {
        if (refreshTimer) {
            clearInterval(refreshTimer);
            refreshTimer = null;
        }
    }
    
    // 页面可见性变化时处理
    document.addEventListener('visibilitychange', () => {
        if (document.hidden) {
            // 页面不可见时停止刷新
            stopAutoRefresh();
        } else {
            // 页面可见时立即刷新一次并重新开始自动刷新
            socket.emit('getRooms');
            startAutoRefresh();
        }
    });
    
    // 连接成功
    socket.on('connect', () => {
        console.log('已连接到服务器');
        
        // 获取房间列表
        socket.emit('getRooms');
        
        // 开始自动刷新
        startAutoRefresh();
    });
    
    // 接收房间列表
    socket.on('roomList', (rooms) => {
        // 清空房间列表
        roomListElement.innerHTML = '';
        
        if (rooms.length === 0) {
            roomListElement.innerHTML = '<div class="no-rooms">暂无可用房间，请创建一个新房间</div>';
            return;
        }
        
        // 添加房间到列表
        rooms.forEach(room => {
            const roomElement = document.createElement('div');
            roomElement.className = 'room-item';
            
            // 设置房间状态样式
            if (room.gameStarted) {
                roomElement.classList.add('game-started');
            }
            
            // 检查房间是否已满
            const isRoomFull = room.playerCount >= 8;
            
            roomElement.innerHTML = `
                <div class="room-name">${room.name}</div>
                <div class="room-info">
                    <span class="player-count">${room.playerCount} / 8 玩家</span>
                    <span class="room-status">${room.gameStarted ? '游戏中' : '等待中'}</span>
                </div>
                <button class="join-btn" ${isRoomFull ? 'disabled' : ''}>加入</button>
            `;
            
            // 加入房间按钮点击事件
            const joinBtn = roomElement.querySelector('.join-btn');
            
            // 如果房间已满，禁用加入按钮
            if (isRoomFull) {
                joinBtn.disabled = true;
                joinBtn.title = '房间已满';
            } else {
                joinBtn.addEventListener('click', () => {
                    const playerName = playerNameInput.value.trim();
                    if (!playerName) {
                        alert('请输入玩家名称');
                        return;
                    }
                    
                    // 跳转到游戏页面，不再传递颜色参数
                    window.location.href = `/game.html?roomId=${room.id}&playerName=${encodeURIComponent(playerName)}`;
                });
            }
            
            roomListElement.appendChild(roomElement);
        });
    });
    
    // 创建房间表单提交事件
    createRoomForm.addEventListener('submit', (e) => {
        e.preventDefault();
        
        const playerName = playerNameInput.value.trim();
        
        if (!playerName) {
            alert('请输入玩家名称');
            return;
        }
        
        // 创建房间，不再传递房间名称参数
        socket.emit('createRoom', {
            playerName
        });
    });
    
    // 房间创建成功
    socket.on('roomCreated', ({ roomId }) => {
        // 跳转到游戏页面，不再传递颜色参数
        const playerName = playerNameInput.value.trim();
        
        window.location.href = `/game.html?roomId=${roomId}&playerName=${encodeURIComponent(playerName)}`;
    });
    
    // 刷新房间列表按钮
    document.getElementById('refreshButton').addEventListener('click', () => {
        socket.emit('getRooms');
    });
    
    // 返回首页按钮
    document.getElementById('backButton').addEventListener('click', () => {
        window.location.href = '/index.html';
    });
    
    // 页面卸载前清除定时器
    window.addEventListener('beforeunload', () => {
        stopAutoRefresh();
    });
});